.help-tile {
	border-radius: var(--mantine-radius-lg);
	background-origin: border-box;
	border: 1px solid transparent;
	flex-shrink: 0;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;

	&:hover {
		background-image: var(--surrealist-gradient) !important;
		box-shadow: var(--surrealist-glow);
		background-origin: border-box !important;
		border-color: rgba(255, 255, 255, 0.3);

		* {
			color: white !important;
		}
	}
}

.root:not(.on-body) .help-tile {
	background-color: var(--mantine-color-body) !important;
}